<template>
    <div>
        <ul>
            <!-- <li v-for="(item,index) in datalist" :key="index">
                {{ item }}
            </li> -->
            <Tabbar-item v-for="(item,index) in datalist" :key="index" :item="item"></Tabbar-item>
        </ul>
    </div>
</template>

<script>
import TabbarItem from './TabbarItem.vue'

export default {
    components:{
        TabbarItem
    },
    data() {
        return {
            datalist:['首页','列表','我的']
        }
    }
}
</script>

<style scoped>
ul{
    display: flex;
    position: fixed;
    bottom: 0;
    width: 100%;
    height: 50px;
}
li{
    flex: 1;
    text-align: center;
    cursor: pointer;
}
</style>